<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../style/fjol_style.css" rel="stylesheet" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">月供详情</h1>
		</header>
		<div class="mui-content">
			<ul class="mui-table-view mui-row morgate-detail-title f08">
			        <li class="mui-table-view-cell mui-col-sm-4 mui-col-xs-4 p0">
			        	首付
			        	<span class="mui-pull-right" id="donePay">万</span>
			        </li>
			        <li class="mui-table-view-cell mui-col-sm-4 mui-col-xs-4 p0">
			        	贷款总额
			        	<span class="mui-pull-right" id="loanPay">万</span>
			        </li>
			        <li class="mui-table-view-cell mui-col-sm-4 mui-col-xs-4 p0">
			        	总利息
			        	<span class="mui-pull-right" id="interestPay">元</span>
			        </li>
			    </ul><br />
			<hr />
			<ul class="mui-table-view mui-row fj-house-tab morgate-detail-title f08 mui-text-center" style="background: none;">
			        <li class="fj-house-tab-li">
			        	<p class="m0">期数</p>
			        </li>
			        <li class="fj-house-tab-li">
			        	<p class="m0">月供本金</p>
			        </li>
			        <li class="fj-house-tab-li">
			        	<p class="m0">月供利息</p>
			        </li>
			        <li class="fj-house-tab-li">
			        	<p class="m0">月供</p>
			        </li>
			        <li class="fj-house-tab-li">
			        	<p class="m0">剩余本金</p>
			        </li>
			    </ul>
		    <div class="mui-scroll-wrapper" style="top: 120px;">
		        <div class="mui-scroll f08">
		            <!--这里放置真实显示的DOM内容-->
		            <ul class="mui-table-view mui-row" id="showMortDetail" style="background: #EFEFF4;">
		            
				    </ul>
		        </div>
		    </div>
		    
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/fj_public_js.js"></script>
		<!--<script src="../js/mortgageJS.js"></script>-->
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
                var wv = plus.webview.currentWebview();
                var id = wv.id;
                var donePay = wv.downPay;//这样就能接收到上个页面传过来的值了
                var allLoan = wv.allLoan;
                var loanArr = wv.loanArr;
                var _housefundy = wv._housefundy;
                var _businessfundy = wv._businessfundy;
                var restInt = wv.restInt;
                
                document.querySelector('#donePay').innerHTML = donePay + '万';
                
                document.querySelector('#loanPay').innerHTML = allLoan + '万';
                
//console.log(loanArr[0].mPay);
				//详细信息显示列表
				var maxLen = Math.max(_housefundy,_businessfundy);
				var showMortDetail = document.querySelector('#showMortDetail');
				var restLoan = allLoan*10000;
							        
					var data = new Array();  
					var interest = 0;
				for(var i=0; i<maxLen*12; i++){
					restLoan -=loanArr[i].mCap;
//					console.log(loanArr[i].mCap);
					interest +=loanArr[i].mInt;
			
					if(i%12==0){
						data.push('<h4 class="mt5" style="line-height:1.5em;">第'+(i/12+1)+'年</h4>');
					}
			        data.push('<li class="fj-house-mort mui-table-view-cell mui-text-center">');
						data.push('<p class="fj-house-mort-p m0">'+(i+1)+'</p>');
						data.push('<p class="fj-house-mort-p m0">'+Math.round(loanArr[i].mCap)+'</p>');
						data.push('<p class="fj-house-mort-p m0">'+Math.round(loanArr[i].mInt)+'</p>');
						data.push('<span class="fj-house-mort-p m0">'+Math.round(loanArr[i].mPay)+'</span>');
						data.push('<p class="fj-house-mort-p m0">'+Math.round(restLoan)+'</p>');
					data.push('</li>');  
			
				}  
				
                document.querySelector('#interestPay').innerHTML = restInt;
                
			       showMortDetail.innerHTML = data.join(''); // 使用join生成最终字符串    
			       
			            });  
            
		</script>
	</body>

</html>